<template>
  <a-modal
  class="function-modal"
  :visible="visible"
  :title="title"
  :maskClosable="false"
  :destroyOnClose="true"
  :keyboard="false"
  :closable="false"
  :confirmLoading="confirmLoading"
  width="70%"
  @cancel="closeModal(false)"
  @ok="handleSubmit">
    <searchTable
      :url="url"
      ref="searchtable"
      :rowKey="'goodsId'"
      :columns="columns"
      :defaultParams="defaultParams"
      :headParams="headParams"
      :tableSelectType="'radio'"
      :form="form"
      :beforeRenderFunc="beforeRenderFunc"
      @selectedRowChange="handleSelectRowSelect"
      :default-params="defaultParams">
      <!-- 搜索条件 -->
      <template slot="searchForm">
        <a-form layout="inline" :form="form">
          <a-form-item label="赠品名称">
            <a-input
              v-decorator="['goodsName']"
              placeholder="请输入赠品名称">
            </a-input>
          </a-form-item>
   <!--       <a-form-item label="赠品类型">
            <a-select
              showSearch
              allowClear
              style="width: 150px"
              :options="giftList"
              v-decorator="['goodsType']"
              placeholder="请选择赠品类型">
            </a-select>
          </a-form-item>-->
        </a-form>
      </template>
      <!-- 操作栏 -->
      <!-- <template slot="oprationRow">
        <permission authority="">
          <a-button type="primary" @click="exportExcel()">导出</a-button>
        </permission>
      </template> -->
      <!-- 表格行操作 record -->
      <template slot="tableOperation" slot-scope="{  }">
         <a-space></a-space>
      </template>
    </searchTable>
    <template slot="footer">
      <a-button key="back" @click="closeModal(false)"> {{ handle == 'view' ? '返回' : '取消' }} </a-button>
      <a-button :loading="confirmLoading" v-if="handle != 'view'" key="submit" type="primary" @click="handleSubmit"> 提交 </a-button>
    </template>
  </a-modal>
</template>

<script>
  import searchTable from "./SearchTable";
  import deepCopy from '@/utils/deepCopy'
  import { findDictNameByValue,createOptionsByDict } from '@/utils/dict'

  export default {
    name: 'functionForm',
    props: {
      handle: { // 操作类型
        type: String,
        default: 'edit'
      },
      title: { // 弹窗标题
        type: String,
        default: '选择赠品'
      },
      selectId: { // 选中行id
        type: String,
        default: ''
      },
      visible: { // 是否显示弹窗
        type: Boolean,
        default: false
      },
    },
    components:{
      searchTable
    },
    data() {
      return {
        url: '/giving/goodsmanage/page', // 列表接口地址
        headParams: {
          baseURL: `${location.origin}/goldenhome/gh/lottery/admin`
        }, // 请求头参数
        defaultParams: {
          goodsType:2
        }, // 默认携带参数
        currentRecord: {}, // 选中行数据
        form: this.$form.createForm(this, { name: "table_search" }), // 搜索表单
        // giftList: createOptionsByDict('GIFT_TYPE'),
        giftList: [
          {label:"商品",value:1,disabled:true},
          {label:'付费会员卡',value:2,},
        ],
        columns: [
          {
            title: '商品名称',
            dataIndex: 'goodsName',
            key: 'goodsName',
            //align: 'center',
            customRender: (text, row) => {
              return <div class="product_td"><table-img src={row.goodsPicture}/><div class="product_name">{text}</div></div>
            }
          },
          {
            title: '是否启用',
            dataIndex: 'status',
            key: 'status',
            //align: 'center',
            customRender: (text, row) => {
              if (text==1){
                return "已启用"
              }else if (text==0){
                return "未启用"
              }else{
                return text
              }
            }
          },
          {
            title: '商品实际库存数',
            dataIndex: 'goodsStock',
            key: 'goodsStock',
            customRender:(text,row)=>{
              if (row.goodsType ==2)
                return "不限量"
            }
          },
          {
            title: '赠品库存数',
            dataIndex: 'stock',
            key: 'stock'
          },
          {
            title: '有效期',
            dataIndex: 'validPeriodUnit',
            key: 'validPeriodUnit',
            customRender:(text,row)=>{
              if (text ==1){
                return "有效期:1年;"
              }
              else if (text ==2){
                return "有效期: 3个月;"
              }
              else if (text ==3){
                return "有效期:1个月;"
              }else {
                return text
              }
            }
          },
          {
            title: '赠品剩余库存数',
            dataIndex: 'remainingStock',
            key: 'remainingStock'
          },
          {
            title: '赠品已被领取',
            dataIndex: 'prizePoolStock',
            key: 'prizePoolStock'
          },
          {
            title: '赠品已被使用',
            dataIndex: 'used',
            key: 'used'
          },
        ],
        confirmLoading: false, // 提交等待
        goodsInfo: {} // 商品信息
      };
    },
    computed: {},
    watch: {
      // 监听弹窗显示，回显数据
      visible(value) {
        if (value && this.selectId) {
          this.$nextTick(()=> {})
        } else {
          this.resetData()
        }
      }
    },
    created() {},
    mounted() {},
    methods: {
      // 处理表格数据
      beforeRenderFunc(data) {
        let _this = this
        data.dataInfo.records.forEach(item => {
          if(_this.selectId == item.goodsId) {
            item.disabled = true
            item.checked = true
          }
        })
        return data
      },
      // 重置
      resetData(){},
      // 选择商品
      handleSelectRowSelect(record) {
        console.log("被选中的赠品",record)
        if(record[0]){
          this.goodsInfo = record[0]
        }
      },
      // 提交
      handleSubmit() {
        if (this.$refs.searchtable.selectedRowKeys.length<=0){
          return this.$message.warn("请选择一个赠品")
        }
        // this.confirmLoading = true;
        if(this.goodsInfo.goodsId) {
          // this.confirmLoading = false;
          this.$emit('submit', this.goodsInfo);
        }/* else {
          this.$confirm({
            title: '关闭确认',
            content: '还未选择商品，确认要关闭选择窗口吗？',
            okText: '确认',
            cancelText: '取消',
            onOk: () => {
              this.closeModal(false)
            }
          });*/
        // }
      },
      // 取消
      closeModal(bool) {
        this.$emit('cancel', bool)
      }
    }
  };
</script>
<style lang="less" scoped></style>